<template>
	<view style="width: 100%;height: 100%;">

		<view class="card-title">
			生产工单
		</view>
		<view class="card-content" style="overflow: auto">
			<view class="" style="display: flex;">
				<view class="btn-style btn-style1" v-if="processName=='振动成型'" @click="reportOrder">报工
				</view>
				<view class="btn-style btn-style1" v-if="processName=='养护'||processName=='热处理'" @click="reportOrder">组盘
				</view>
				<view class="btn-style btn-style1" v-if="processName=='脱模精整'" @click="reportOrder">拆盘
				</view>
				<view class="btn-style btn-style1" v-if="processName=='包装'" @click="reportOrder">拆盘
				</view>
			</view>

			<u-collapse v-if="processName=='脱模精整'||processName=='包装'" @click.stop>

				<u-collapse-item v-for="(item, index) in workstatList" :key="index" @click.stop>
					<!-- 自定义标题：包含多选框 + 托盘号 -->
					<view slot="title" class="custom-title" @click.stop>
						<u-checkbox v-model="item.selected" @click.native.stop="handleItemSelect(item)"
							:name="item.groupCode" class="collapse-checkbox"></u-checkbox>
						<text style="margin-left: 20rpx;">托盘号：{{ item.groupCode }}</text>

					</view>
					<!-- 内容区域：表格 -->
					<uni-table ref="table2" :loading="loading" border stripe emptyText="暂无更多数据">
						<uni-tr>

							<uni-th align="center">发布工单</uni-th>
							<uni-th align="center">砖号</uni-th>
							<uni-th align="center">产品牌号</uni-th>
							<uni-th align="center">产品名称</uni-th>

						</uni-tr>
						<uni-tr v-for="(i,index1) in item.proReportingList" :key="index1">

							<uni-td>{{ i.releaseOrderCode }}</uni-td>
							<uni-td>{{ i.brickNumber }}</uni-td>
							<uni-td>{{ i.productName }}</uni-td>
							<uni-td>{{ i.productColor }}</uni-td>

						</uni-tr>

					</uni-table>
				</u-collapse-item>

			</u-collapse>

			<div style="width: 100%;height: 100%;" v-else>

				<uni-table type="selection" @selection-change="selectionChange" ref="table" border stripe
					emptyText="暂无更多数据" style="width:90%;height: 69%;margin: 10rpx ;overflow: auto;">
					<uni-tr>
						<uni-th align="center" v-if="processName=='振动成型'">任务编号</uni-th>

						<uni-th align="center">发布工单</uni-th>
						<uni-th align="center">砖号</uni-th>
						<uni-th align="center">产品名称</uni-th>
						<uni-th align="center">产品名称</uni-th>

					</uni-tr>
					<uni-tr v-for="(item,index) in workstatList" :key="index">
						<uni-td v-if="processName=='振动成型'">{{ item.workorderCode }}</uni-td>

						<uni-td>{{ item.releaseOrderCode }}</uni-td>
						<uni-td>{{ item.brickNumber }}</uni-td>
						<uni-td>{{ item.productName }}</uni-td>
						<uni-td>{{ item.productColor }}</uni-td>

					</uni-tr>

				</uni-table>
				<uni-pagination  v-if="total>0" @change="pagchange" title="标题文字"
					show-icon="true" :total="total" :current="queryParams.pageNum" :pageSize='queryParams.pageSize'
					showIcon='true'></uni-pagination>
			</div>


		</view>

		<u-toast ref="uToast" />
	</view>
</template>

<script>
	export default {
		name: 'ProductionWorkOrders',
		props: {
			currentProps: {
				typeof: Object,
				default: () => ({})
			},
			// totalProps: {
			// 	typeof: Number,
			// 	default: 0
			// },
			// workstatListProps: {
			// 	typeof: Array,
			// 	default: () => ([])
			// }
		},
		computed: {

		},
		data() {
			return {
				workstatList: [],
				total: 0,
				queryParams: {
					pageNum: 1,
					pageSize: 10,
				},
				currIndex: [],
				// 当前选中的托盘号
				selectedGroupCode: [],

			}
		},

		created() {
			// this.workstatList = this.$props.workstatListProps;
			this.processName = (this.currentProps && this.currentProps.processName) || ''
			this.getQueueList()
			// console.log('工单信息created', this.totalProps)
		},

		methods: {
			// 获取发布工单
			getQueueList() {

				if (this.processName == '养护') {
					// 查询已成型报工但未养护组盘的工单列表

					this.$u.api.noCuringGroup(this.queryParams).then(res => {
						if (res.rows.length > 0) {

							this.workstatList = res.rows;
							this.total = res.total

						}


					});
				} else if (this.processName == '脱模精整') {
					// 查询养护已组盘但未拆盘的工单列表

					this.$u.api.groupNoUngroup(this.queryParams).then(res => {
						if (res.rows.length > 0) {

							this.workstatList = res.rows.map(item => {
								return {
									...item,
									selected: false
								}
							})
							this.total = res.total

						}


					});
				} else if (this.processName == '热处理') {
					// 查询精整已完成但未热处理组盘的工单列表

					this.$u.api.noHeatGroup(this.queryParams).then(res => {
						if (res.rows.length > 0) {
							this.workorder = res.rows[0]
							this.workstatList = res.rows;
							this.total = res.total



						}


					});
				} else if (this.processName == '包装') {
					// 查询热处理已组盘但未拆盘的工单列表
					this.$u.api.groupedNotUngrouped(this.queryParams).then(res => {
						if (res.rows.length > 0) {

							this.workstatList = res.rows.map(item => {
								return {
									...item,
									selected: false
								}
							});
							this.total = res.total


						}


					});
				} else {
					// 其他的工序展示发布工单
					// 查询发布工单
					let arr = {
						status: '6',
						...this.queryParams
					}
					this.$u.api.listreleaseOrder(arr).then(res => {
						if (res.rows.length > 0) {

							this.workstatList = res.rows;
							this.total = res.total



						}

					});
				}


			},

			// 确认报工
			reportOrder() {

				if (this.currIndex.length > 0 || this.selectedGroupCode.length > 0) {

					uni.showModal({
						title: '提示',
						content: '确定操作？',
						success: (res) => {
							if (res.confirm) {
								console.log('用户点击确定');
								// 选中的数据
								let selectedData = this.currIndex.map(index => this.workstatList[index])
									.filter(item => item !== undefined);
								console.log('selectedData', this.processName, selectedData)

								if (this.processName == '振动成型') {
									let arr = selectedData.map(item => {
										return {
											releaseOrderId: item.releaseOrderId,
											processCode: 'FORMING',
											actionType: 'REPORT'
										}
									})

									this.$u.api.addReportData(arr).then(res => {
										if (res.code == 200) {
											// 通知父组件更新工单数据
											uni.$emit('updateQueueList', res)
											console.log('报工成功', res)
											this.$refs.uToast.show({
												title: '操作成功',
												type: 'success',
											})
										}
									})
								} else if (this.processName == '养护') {
									let arr = selectedData.map(item => {
										return {
											releaseOrderId: item.releaseOrderId,
											processCode: 'CURING',
											actionType: 'GROUP'
										}
									})
									console.log('报工', arr)
									this.$u.api.addReportData(arr).then(res => {
										// console.log('报工成功', res)
										if (res.code == 200) {
											// 通知父组件更新工单数据
											uni.$emit('updateQueueList')


											this.$refs.uToast.show({
												title: '操作成功',
												type: 'success',
											})
										}
									})

								} else if (this.processName == '脱模精整') {
									let arr = this.selectedGroupCode.map(item => item.groupCode)
									console.log('报工', arr)
									this.$u.api.unstackingByCode(arr).then(res => {
										// console.log('报工成功', res)
										if (res.code == 200) {
											// 通知父组件更新工单数据
											uni.$emit('updateQueueList')

											this.$refs.uToast.show({
												title: '操作成功',
												type: 'success',
											})
										}
									})

								} else if (this.processName == '热处理') {
									let arr = selectedData.map(item => {
										return {
											releaseOrderId: item.releaseOrderId,
											processCode: 'HEAT_TREATMENT',
											actionType: 'GROUP'
										}
									})
									console.log('报工', arr)
									this.$u.api.addReportData(arr).then(res => {
										// console.log('报工成功', res)
										if (res.code == 200) {
											// 通知父组件更新工单数据

											this.$refs.uToast.show({
												title: '操作成功',
												type: 'success',
											})

											uni.$emit('updateQueueList')
										}
									})

								} else if (this.processName == '包装') {

									let arr = this.selectedGroupCode.map(item => item.groupCode)
									console.log('包装', arr)

									this.$u.api.unstackingByCode(arr).then(res => {

										if (res.code == 200) {
											// 通知父组件更新工单数据
											uni.$emit('updateQueueList')

											this.$refs.uToast.show({
												title: '操作成功',
												type: 'success',
											})
										}
									})
								}

							} else {
								console.log('取消')
							}

						},
						fail() {}

					})
				} else {
					this.$refs.uToast.show({
						title: '请先选择工单或者托盘',
						type: 'error',
					})
				}

			},
			// 判断工序
			isProcess(process) {
				return this.currentProps && this.currentProps.processName === process;
			},
			// 发布工单选中
			selectionChange(e) {
				this.currIndex = e.detail.index
			},
			// 处理托盘选择
			handleItemSelect(item) {
				this.selectedGroupCode = []
				// 这里可以添加额外的逻辑
				this.workstatList.forEach(item => {
					if (item.selected) {
						this.selectedGroupCode.push(item)
					}
				})
				// this.selectedGroupCode = this.workstatList.filter(item => item.selected == true);
				console.log('托盘选中状态变更:', this.selectedGroupCode);

			},

			// 发布工单选中
			selectionChange(e) {
				this.currIndex = e.detail.index
			},
			// 分页器
			pagchange(e) {
				this.$refs.table.clearSelection()
				this.queryParams.pageNum = e.current
				this.getQueueList()
				// 通知父组件更新工单数据,分页
				// uni.$emit('updateQueueListQuery', this.queryParams)
			},
		}
	}
</script>

<style lang="scss" scoped>
	::v-deep .card-title {
		line-height: 30px;
		position: relative;
		padding-left: 20px;
		font-size: 14px;
		font-weight: 600;
		font-style: italic;
		color: #ffaa00;
		border-bottom: 1px solid #e4e7ed;
	}

	.card-content {
		// position: relative;
		display: flex;
		// flex-direction: column;
		width: 100%;
		height: 100%;
		align-items: flex-start;
		justify-content: flex-start;
		margin: 10px;

	}

	.btn-style {
		width: 40%;
		height: 40%;
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: center;
		font-size: 25rpx;
		color: white;
		background: #00aaff;
		cursor: pointer;
		margin: 5rpx;
		border-radius: 5px;
	}

	.btn-style1 {

		width: 170rpx;
		height: 70rpx;
		// margin: 10rpx;
		font-size: 40rpx;
	}
</style>